<script setup lang="ts">
import coinImg from './img/coin.png';
import couponImg from './img/coupon.png';
import diamondImg from './img/diamond.png';
import rechargeImg from './img/recharge.png';
import {pushTo} from "@/router";
import CurrencyDetail from "@/views/qq/home/home-top/CurrencyTypes/CurrencyDetail.vue";
import {RouterName} from "@/utils/enum-type";
</script>
<template>
  <div class="box">
    <CurrencyDetail :count="787874" :src="coinImg"/>
    <CurrencyDetail :count="6632" :src="couponImg"/>
    <CurrencyDetail :count="1234" :src="diamondImg"/>
    <img @click="pushTo({name:RouterName.QQRecharge})" :src="rechargeImg" alt="" class="recharge">
  </div>
</template>
<style scoped lang="scss">
.box {
  display: flex;
  align-items: flex-start;

  .recharge {
    width: 3em;
    cursor: pointer;
  }

  > * + * {
    margin-left: 1em;
  }
}
</style>